/*
 * @Author: xiaosihan 
 * @Date: 2025-01-11 14:59:48 
 * @Last Modified by: xiaosihan
 * @Last Modified time: 2025-01-27 12:45:58
 */


import hashHistory from "@hashHistory";
import utils from "@utils";
import homeRenderer from "@views/home/homeRender";
import { Button, Radio } from 'antd';
import { autorun } from "mobx";
import { ReactNode, useEffect, useRef, useState } from "react";
import threeLoader from "three-base/threeLoader";
import RunTime from "../RunTime/RunTime";
import styles from "./centerBtns.module.less";
import homeStore from "@views/home/homeStore";
import isMobile from "is-mobile";
const { Group: RadioGroup } = Radio;

interface Iprops {
    children?: ReactNode
}

// 中心按钮
export default function CenterBtns(props: Iprops) {

    const dom = useRef<HTMLDivElement | null>(null);
    const [firstPerson, setFirstPerson] = useState(homeStore.firstPerson);

    useEffect(() => {

    }, []);

    useEffect(() => autorun(() => {
        setFirstPerson(homeStore.firstPerson);
    }), []);

    return (
        <div ref={dom} className={styles.centerBtns} >

            <Radio.Group
                options={[
                    { label: '透视相机', value: 'perspectiveCamera' },
                    { label: '正交相机', value: 'orthographicCamera' },
                ]}
                defaultValue="perspectiveCamera"
                onChange={e => {
                    homeRenderer.setCameraType(e.target.value);
                }}
                optionType="button"
                buttonStyle="solid"
            />

            {
                !isMobile() &&
                <Button
                    onClick={() => {
                        homeStore.setFirstPerson(!firstPerson);
                    }}
                >第{firstPerson ? "一" : "三"}人称</Button>
            }

            <Button
                type="primary"
                onClick={() => {
                    homeRenderer.download();
                }}
            >下载渲染图</Button>

            <Button
                type="primary"
                onClick={() => {
                    hashHistory.push("/home2");
                }}
            >home2</Button>

            <Button
                type="primary"
                onClick={() => {
                    hashHistory.push("/meshParticles");
                }}
            >模型粒子</Button>

            <Button
                type="primary"
                onClick={() => {
                    hashHistory.push("/helix");
                }}
            >螺旋线</Button>

            <Button
                type="primary"
                onClick={() => {
                    hashHistory.push("/octreeDemo");
                }}
            >八叉树测试</Button>

            <Button
                type="primary"
                onClick={async () => {
                    const file = await utils.selectFile(".glb,.gltf,.zip");
                    const object3d = await threeLoader.loadModel(file);
                    console.log("object3d", object3d);
                }}
            >加载本地单文件测试</Button>

            <Button
                type="primary"
                onClick={async () => {
                    const files = await utils.selectDirectory();
                    const object3d = await threeLoader.loadModel(files.filter(file => ["glb", "gltf", "zip", "jpg", "jpeg", "png", "webp", "obj", "mtl", "fbx", "usdz", "dae"].includes(utils.getSuffix(file.name))));
                }}
            >加载本地文件夹测试</Button>

            <Button
                type="primary"
                onClick={async () => {
                    hashHistory.push("/fps");
                }}
            >
                fps
            </Button>

            {/* 运行时间 */}
            <RunTime />


        </div>
    );

}